<template>
  <div id="app">
  		<HeadNav v-if="headShow" ></HeadNav>
  		<router-view class="view"/>
  </div>
</template>

<script>
import HeadNav from '@/components/head-nav/index'
export default {
  name: 'App',
  computed:{
     headShow(){
       return this.$store.state.headShow
     }
  },
  components:{
  	HeadNav
  }
}
</script>

<style>
  body,html{
    height: 100%;
  }
  ol, ul {
    list-style-type: none;
    list-style-image: none;
  }
  li{
    list-style: none;
  }
  a{
    text-decoration:none;
    color: #555;
  }
  i{
    font-style: normal;
  }
  #app {
    height: 100%;
    font-family: 'Avenir', Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-align: center;
    color: #2c3e50;
    display: flex;
    flex-flow: column nowrap;
  }
  #app .view{
    flex: 1;
  }
  .s_fs_20 {
      font-size: 20px;
  }

  .s_fc_9 {
      color: #999;
  }
  .s_fs_16 {
      font-size: 16px;
  }
  .lh32 {
      line-height: 32px;
  }
  .lh28 {
      line-height: 28px;
  }
  .lh22 {
      line-height: 22px;
  }
  .s_fs_12 {
      font-size: 12px;
  }
  .s_fc_9 {
      color: #999;
  }
  .mb30{
      margin-bottom: 30px;
  }
  .w280 {
      width: 280px;
  }
  .w90{
    width: 90px;
  }
  .mb10{
    margin-bottom: 10px;
  }
  .mb40{
    margin-bottom: 40px;
  }
  .mb20{
    margin-bottom: 20px;
  }
  .mr4 {
      margin-right: 4px;
  }
  input{
      display: inline-block;
      height: 32px;
      font-size: 12px;
      line-height: 1.224489797;
      padding: 0 9px;
      border-width: 1px;
      border-style: solid;
      background-color: #fff;
      background-image: none;
      box-shadow: none;
      border-radius: 4px;
      box-sizing: border-box;
      transition: border-color .15s ease-out;
      border-color: #e6e6e6;
      color: #333;
  }
  .n3-btn-group>.n3-btn-group{
    float: none;
  }
  .clearfix:after, .clearfix:before {
    content: "";
    display: table;
  }
  .clearfix:after {
    clear: both;
  }
  .fl{
    float: left;
  }
  .fr{
    float: right;
  }
  .color-grey{
    color: #999;
  }
  .color-blue{
    color: #4d7fff;
  }
  .color-c{
    color: #ccc;
  }
  .el-input,.el-input__suffix,.el-input__icon{
  	height: 100%;
  	line-height:100% !important;
  }
  .el-input__inner{
  	width: 100% !important;
  	height: 100% !important;
  }
  #headerNav .el-select .el-input__inner{
    background: none;
    border: none;
    color: #ffffff !important;
    width: 200px;
  }
  .el-dialog__body{
    padding: 0!important;
  }
  .el-dialog__header{
	text-align: left;
}
.empty{
	height: 300px;
	line-height: 300px;
	font-size: 20px;
  color: #cccccc;
  text-align: center;
}
.el-menu{
  border: 0px !important;
}
.el-pagination{
  margin: 10px auto;
}
.el-menu-item{border: 0}
  .n3-dropdown-menu>li>a:hover .cl{display: inline-block !important;}
.lodding{
  font-size: 46px;
}

.zs_iconfon:hover{
  cursor:help;
}
.sortClass{
  color: #4d7fff;
}
.grey-hollow-icon {
    display: inline-block;
    border: 1px solid #ccc;
    color: #999;
    padding: 0 6px;
    border-radius: 10px;;
    font-size: 12px;
    margin-right: 20px;
}
</style>
